<%@ page import="java.util.List" %>
<%@ page import="java.util.HashMap" %>
<%@ page import="java.util.Map" %>
<%@ page import="com.my.hotel.entity.vo.ProductRomVo" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<% String path = request.getContextPath();
    request.setAttribute("path", path);%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>酒店管理</title>
    <link rel="stylesheet" type="text/css" href="../../../css/index.css"/>
    <script src="../../../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/lbt.js" type="text/javascript" charset="utf-8"></script>
    <script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript"></script>
    <script src="../../../js/ditu.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/index.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="backdrop"></div>













<div id="live2d-widget" >
    <canvas id="live2dcanvas">
</div>

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<script>
    L2Dwidget.init({
        "model": {
            jsonPath: "https://unpkg.com/live2d-widget-model-hijiki/assets/hijiki.model.json",//这里改模型，前面后面都要改
            "scale": 1
        },
        "display": {
            "position": "left",//设置看板娘的上下左右位置
            "width": 200,
            "height": 500,
            "hOffset": 70,
            "vOffset": 70
        },
        "mobile": {
            "show": true,
            "scale": 0.5
        },
        "react": {
            "opacityDefault": 0.7,//设置透明度
            "opacityOnHover": 0.2
        }
    });
    window.onload = function () {
        $("#live2dcanvas").attr("style", "position: fixed; opacity: 0.7; right: 70px; bottom: 0px; z-index: 1; pointer-events: none;")
    }
</script>







<%-- 悬浮页 --%>
<div id="light" class="modal">
    <form id="table1" onsubmit="return pay()" action="/utils/pay" method="post" enctype="application/x-www-form-urlencoded">

    </form>

</div>

<%-- 悬浮页2--%>
<div id="light2" class="modal" style="width:500px;height: 200px;">
        <table border="1">
            <tr>
                <td>回复:</td>
                <td>
                    <textarea rows="4" cols="50" style="overflow-y: scroll"></textarea>
                </td>
            </tr>
            <tr>
                <td colspan="2">

                    <a   class="close" style="text-decoration: none" href="/utils/discuss">发布</a>
                    &nbsp;&nbsp;&nbsp;&nbsp;
                    <%--<a style=" border-bottom: none;" href="###" onclick="return close2()">关闭</a>--%>
                    <span class="close" onclick="close3()">关闭 </span>
                </td>

            </tr>
        </table>


</div>


<script type="text/javascript">
    function pay() {
        //当前时间
        var myDate = new Date();
        var now = myDate.valueOf();
        var date
        now = now - 60*60*24*1000
        console.log("now"+now)
        var formData = new FormData($("#table1")[0]);
        date = formData.get("date").valueOf();
        date = new Date(date).valueOf();
        console.log("date"+date)

        if(window.isNaN(date)||date==undefined||date==""){
            alert("必须填写预定时间")
            return false;
        }else if(now>=date){
            alert("预定时间必须大于当前时间")
            return false;
        }else{
            return true;
        }

        var day = formData.get("day").valueOf();
        if(day<1){
            alert("入住天数不能小于1天");
            return false;
        }
        close2();
        return false;
    }
    //计算价格
function dayPrice(){
    debugger
        var formData = new FormData($("#table1")[0]);
        var day = formData.get("day").valueOf();
        if(day<1){
            alert("入住天数不能小于1天");
            return false;
        }


        // var day = $("#day")[0];
        var price1= $("#price1")[0];
        var price2= $("#price2")[0];
        var onePrice= $("#onePrice").val();
        var count = day * onePrice;
        count=count.toFixed(2);
        price1.innerText=count;
        price2.value = count;
        //price2.val(count)



}
    function predetermine(obj) {

        var userType = $(obj).attr("data-userType")
        if (userType == 1) {  //未登录
// show the modal
            var ele = document.getElementsByClassName("modal")[0];
            ele.style.visibility = 'visible';
            ele.style.opacity = '1';
            // show backdrop effect
            var backdrop = document.getElementsByClassName("backdrop")[0];
            backdrop.style.opacity = '1';
            backdrop.style.visibility = 'visible';


            //写渲染的
            var index = $(obj).attr("data-userId")
            if (index == 0) {
                <c:set  var="list" value="${JdList.list[0]}" scope="request" />
            } else if (index == 1) {
                <c:set  var="list" value="${JdList.list[1]}" scope="request" />
            } else if (index == 2) {
                <c:set  var="list" value="${JdList.list[2]}" scope="request" />
            } else if (index == 3) {
                <c:set  var="list" value="${JdList.list[3]}" scope="request" />
            } else if (index == 4) {
                <c:set  var="list" value="${JdList.list[4]}" scope="request" />
            } else if (index == 5) {
                <c:set  var="list" value="${JdList.list[5]}" scope="request" />
            } else if (index == 6) {
                <c:set  var="list" value="${JdList.list[6]}" scope="request" />
            } else if (index == 7) {
                <c:set  var="list" value="${JdList.list[7]}" scope="request" />
            } else if (index == 8) {
                <c:set  var="list" value="${JdList.list[8]}" scope="request" />
            } else if (index == 9) {
                <c:set  var="list" value="${JdList.list[9]}" scope="request" />
            } else if (index == 10) {
                <c:set  var="list" value="${JdList.list[10]}" scope="request" />
            }
            <%
            Object list = request.getAttribute("list");
            ProductRomVo list1 = (ProductRomVo)list;
            %>

            var img = $(obj).data("img");
            var price = $(obj).data("price");
            var id = $(obj).data("jdid");
            var policy = $(obj).data("policy");
            var area = $(obj).data("area");
            var name = $(obj).data("name");
            var div1 = $("#table1")[0]
            // var div1 = $("#light")[0]
            div1.innerHTML = "\t<table >\n" +
                "<input type=\"hidden\" value="+id+"  name=\"id\">\n" +
                "\n <input type=\"hidden\" value="+name+"  name=\"tradeName\">\n"+
                "<input type=\"hidden\" id=\"price2\" value="+price+"  name=\"tradePrice\">\n"+
                "\n" +
                "\t\t\t\t\t\t\t<tr>\n" +
                "\n" +
                "\t\t\t\t\t\t\t\t<td colspan=\"2\">\n" +
                "\t\t\t\t\t\t\t\t<img src=\""+img+"\" style=\"width:90px;height:70px\" />\n" +
                "\t\t\t\t\t\t\t\t</td>\n" +
                "\t\t\t\t\t\t\t</tr>\n" +



                "\t\t\t\t\t\t\t<tr>\n" +
                "\t\t\t\t\t\t\t\t<td>大小(㎡)</td>\n" +
                "\t\t\t\t\t\t\t\t<td>"+area+"㎡</td>\n" +
                "\t\t\t\t\t\t\t</tr>\n" +


                "\t\t\t\t\t\t\t<tr>\n" +
                "\t\t\t\t\t\t\t\t<td>入住时间</td>\n" +
                "\t\t\t\t\t\t\t\t<td>\n" +
                "\t\t\t\t\t\t\t\t\t<input  type=\"date\" name=\"date\">\n" +
                "\t\t\t\t\t\t\t\t</td>\n" +
                "\t\t\t\t\t\t\t</tr>\n" +



                "\t\t\t\t\t\t\t<tr>\n" +
                "\t\t\t\t\t\t\t\t<td>入住日期</td>\n" +
                "\t\t\t\t\t\t\t\t<td>" +
                "<input id=\"day\" type=\"number\" name=\"day\" value='1' onblur='dayPrice()'>" +
                "</td>\n" +
                "\t\t\t\t\t\t\t</tr>\n" +"<input id=\"onePrice\" type=\"hidden\" name=\"onePrice\" value="+price+">"

                +
                "\t\t\t\t\t\t\t<tr>\n" +
                "\t\t\t\t\t\t\t\t<td>价格</td>\n" +
                "\t\t\t\t\t\t\t\t<td id=\"price1\">\n" +
                "\n" +
                price+

                "\t\t\t\t\t\t\t\t</td>\n" +
                "\t\t\t\t\t\t\t</tr>\n" +


                "\t\t\t\t\t\t\t<tr>\n" +
                "\t\t\t\t\t\t\t\t<td colspan=\"2\">\n" +
                "\t\t\t\t\t\t\t\t\t该房间限制 两人 入住 "+policy+"\n" +
                "\t\t\t\t\t\t\t\t</td>\n" +
                "\t\t\t\t\t\t\t</tr>\n" +


                "\t\t\t\t\t\t\t<tr>\n" +
                "\t\t\t\t\t\t\t\t<td colspan=\"2\">\n" +
                "\t\t\t\t\t\t\t\t\t<input type='submit' value='预定'/>\n" +
                "\t\t\t\t\t\t\t\t\t<button onclick=\"return close2()\">取消</button>\n" +
                "\t\t\t\t\t\t\t\t</td>\n" +
                "\t\t\t\t\t\t\t</tr>\n" +
                "\t\t\t\t\t\t</table>\n" +
                "\n"
            // openDialog(); //打开悬浮页
        } else {  //进入预定

            this.setTimeout(function () {
                alert("你还未登录请先登录\r\n两秒后跳转登录页面")
                window.location.href = "/utils/forwardToLogin/login?isLogin=0";
            }, 2000)
        }

    }

    function openDialog() {
        // document.getElementById('light').style.display='block';
        // show the modal
        var ele = document.getElementsByClassName("mask")[0];
        // ele.style.display = block;
        ele.style.visibility = visible;
        ele.style.opacity = 1;
        // show backdrop effect
        var backdrop = document.getElementsByClassName("backdrop")[0];
        backdrop.style.opacity = 1;
        backdrop.style.visibility = visible;

    }
    function close2(){
        // close modal

        var light = $("#light")[0];

        light.style.visibility='hidden';
        light.style.opacity = '0';
        // close backdrop effect
        var backdrop = document.getElementsByClassName("backdrop")[0];
        backdrop.style.opacity='0';
        backdrop.style.visibility='hidden';
        return false
    }
    function close() {
        var light = $("#light")[0];

        light.style.visibility = 'hidden';
        light.style.opacity = '0';
        // close backdrop effect
        var backdrop = document.getElementsByClassName("backdrop")[0];
        backdrop.style.opacity = '0';
        backdrop.style.visibility = 'hidden';
        return false
    }
    function close3() {

        // close modal

        var light = $("#light2")[0];

        light.style.visibility = 'hidden';
        light.style.opacity = '0';
        // close backdrop effect
        var backdrop = document.getElementsByClassName("backdrop")[0];
        backdrop.style.opacity = '0';
        backdrop.style.visibility = 'hidden';
        return false
    }
</script>
<div id="div">

    <!--头-->
    <div id="head">
        <div id="title">
            <span id="logo"><a href="##">王府井永光酒店</a></span>
            <span class="dh"><a href="#shouyebufen">首页</a></span>
            <span class="dh"><a href="#fangjianyuding">房间预定</a></span>
            <span class="dh"><a href="#jiudianxiangqing">酒店详情</a></span>
            <span class="dh"><a href="#pingjia">评价</a></span>
            <span class="dh"><a href="${userInfo==null?"/utils/forwardToLogin/login?isLogin=0":"/utils/forward/order"}">我的订单</a></span>
            <c:choose>
                <c:when test="${userInfo==null}">
                    <span class="dhlogin"><a href="/utils/forwardToLogin/login?isLogin=0">登录</a></span>
                    <span class="dh2"><a href="###" class="interval">|</a></span>
                    <span class="dh2"><a href="/utils/forwardToLogin/login?isLogin=1">注册</a></span>
                </c:when>
                <c:otherwise>
                    <span class="dhlogin">欢迎你:</span>
                    <span class="dh2">${userInfo.username}</span>
                    <span class="dh2"><a href="/jd/logout">退出</a></span>
                </c:otherwise>
            </c:choose>


        </div>
    </div>
    <a href="" name="shouyebufen"></a>
    <div id="headTS">

    </div>

    <!--首页部分-->
    <div id="shouye">
        <div id="lbt">
            <div class="container">
                <!-- 先把第一张图片显示出来 -->
                <img class="on" src="../../../img/001.jpg"/>
                <img src="../../../img/002.jpg"/>
                <img src="../../../img/003.jpg"/>
                <img src="../../../img/004.jpg"/>
                <!-- 左右切换 -->
                <div class="left"><</div>
                <div class="right">></div>
                <!-- 焦点 -->
                <ul>
                    <li class="active"></li>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </div>
        </div>
        <div id="shouye_right">
            <p id="shouye_bt">王府井永光酒店</p>
            <p>
                <span id="pf">5.0分</span>
                <span id="hp">100%好评</span>
            </p>
            <p>
                <span class="td">位置优越</span>
                <span class="td">性价比高</span>
                <span class="td">环境舒适</span>
            </p>
            <p>酒店地址：xxx省xxx市xxx街道xxx号</p>
            <p>客服电话：12345678901</p>
        </div>
    </div>

    <!--房间预定-->
    <a href="" name="fangjianyuding"></a>
    <div id="fjyd">
        <div id="fjyd_title" style="font-size: 48px;">
            房间预定
        </div>
        <div id="fjyd_content">
            <form action="">
                <select name="fangxing" id="fangxing">
                    <option value="0">床型</option>
                    <option value="1">大床房</option>
                    <option value="2">双床</option>
                    <option value="3">单人床</option>
                </select>
                <select name="renshu" id="renshu">
                    <option value="0">入住人数</option>
                    <option value="1">一人</option>
                    <option value="2">两人</option>
                    <option value="3">三人</option>
                </select>
                <input type="submit" id="fjyd_cx" value="查询"/>
            </form>
            <table id="fjyd_table">
                <tr id="fjyd_tr">
                    <td>图片</td>
                    <td>房型</td>
                    <td>面积（㎡）</td>
                    <td>早餐</td>
                    <td>入住人数</td>
                    <td>政策</td>
                    <td>房价</td>
                    <td>操作</td>
                </tr>
                <c:forEach items="${JdList.list}" var="var" varStatus="varS">
                    <%--给变量attendanceStatus赋值--%>
                    <c:set var="setmoney" value="${var.money}" scope="request"/>
                    <c:set var="setdiscount" value="${var.discount}" scope="request"/>
                    <tr class="fjyd_xx">
                        <td><img src="${var.img}"/></td>
                        <td>${var.style}</td>
                        <td>${var.area}㎡</td>
                        <td>${var.breakfast}</td>
                        <td>${var.numofpeople}</td>
                        <td>${var.policy}</td>
                        <td class="money">

                            <c:choose>
                                <c:when test="${var.discountType==0}">
                                    <span style="text-decoration: line-through;color: grey">￥${var.money}</span>
                                    ￥${var.money-var.discount}
                                    <%
                                        double setmoney = (Double) request.getAttribute("setmoney");
                                        double setdiscount = (Double) request.getAttribute("setdiscount");
                                        String l = String.format("%.2f", (setmoney - setdiscount));
                                        request.setAttribute("mo", l);

                                    %>
                                </c:when>
                                <c:when test="${var.discountType==1}">
                                    <span style="text-decoration: line-through;color: grey">￥${var.money}</span>
                                    ￥<%
                                    double setmoney = (Double) request.getAttribute("setmoney");
                                    double setdiscount = (Double) request.getAttribute("setdiscount");
                                    String l = String.format("%.2f", (setmoney * setdiscount));
                                    request.setAttribute("mo", l);

                                %>
                                    ${mo}
                                </c:when>
                                <c:otherwise>
                                    ${var.money}
                                    <%
                                        Double s = (Double)request.getAttribute("setmoney");
                                        String l = String.format("%.2f", s);
                                        request.setAttribute("mo", l);
                                    %>
                                </c:otherwise>
                            </c:choose>
                        </td>
                        <td>
                            <a onclick="predetermine(this)" class="backcontent"
                               data-img="${var.img}"
                               data-price="${mo}" <%--最终价格--%>
                               data-jdId="${var.id}"
                               data-policy="${var.breakfast}"
                               data-area="${var.area}"
                               data-name="${var.style}"
                               data-userId="${userInfo==null?null:varS.index}"
                               data-userType="${userInfo==null?0:1}">预定</a>
                        </td>
                    </tr>
                </c:forEach>

                <tr style="height: 100px;">
                    <td colspan="8">
                        <a href="/utils/forward/index/${JdList.size}?page=1">首页</a>
                        <a href="/utils/forward/index/${JdList.size}?page=${JdList.isFirstPage ==true?JdList.pageNum:JdList.pageNum-1}">上一页</a>
                        <a href="/utils/forward/index/${JdList.size}?page=${JdList.isLastPage==true?JdList.pageNum:JdList.pageNum+1}">下一页</a>
                        <a href="/utils/forward/index/${JdList.size}?page=${JdList.pages}">尾页</a>
                        <span>${JdList.pageNum}/${JdList.pages}页</span>
                        <span>共${JdList.total}条</span>
                    </td>
                </tr>
            </table>
        </div>
    </div>


    <!--酒店详情-->
    <a href="" name="jiudianxiangqing"></a>
    <div id="jdxq">
        <div style="font-size: 48px;">
            酒店详情
        </div>
        <div id="jdxq_content">
            <table>
                <tr>
                    <th>酒店亮点</th>
                    <td>战略合作酒店，城市销量前列，优质服务保障，提供去哪儿平台专属低价</td>
                </tr>
                <tr>
                    <th>联系方式</th>
                    <td>+861065265558</td>
                </tr>
                <tr>
                    <th>基本信息</th>
                    <td>200间客房</td>
                </tr>
                <tr>
                    <th class="jdxq_jdjj">酒店简介</th>
                    <td>
                        酒店位于市中心王府井地区，周边景点众多，靠近天安门广场、故宫，毗邻王府井步行街、新东方广场仅150米。<br/>
                        酒店位置优越，交通便捷。<br/>
                        酒店周围汇聚着北京最繁荣的购物、休闲娱乐、餐饮，酒店门口是东华门夜市汇聚各类特色小吃。<br/>
                        无论您是去天安门广场看升旗还是去故宫博物院，皇城根遗址公园。<br/>
                        酒店房间装修温馨典雅，基础生活设施齐备，将是您理想的温馨的住所，酒店全体员工期待您的光临。
                    </td>
                </tr>
                <tr>
                    <th class="jdxq_jdjj">入离时间</th>
                    <td>
                        入住时间：入住当天14:00后<br/>
                        离店时间：离店当天12:00前
                    </td>
                </tr>
                <tr>
                    <th>儿童政策</th>
                    <td>每间客房最多容纳1名0至12岁儿童与成人共用现有床铺</td>
                </tr>
                <tr>
                    <th>宠物</th>
                    <td>不可携带宠物。</td>
                </tr>
                <tr>
                    <th>通用设施</th>
                    <td>
                        <span style="color: #27C8E3;">√</span>电梯&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>空调&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>24小时热水&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>吹风机&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>门禁系统&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>净水机&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>自动售货机
                    </td>
                </tr>
                <tr>
                    <th>清洁服务</th>
                    <td>
                        <span style="color: #27C8E3;">√</span>洗衣服务&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>干衣机&nbsp;&nbsp;&nbsp;
                        <span style="color: #27C8E3;">√</span>洗衣房&nbsp;&nbsp;&nbsp;
                    </td>
                </tr>
            </table>
            <div id="jdxq_dt">
                <div class="ditu" id="map"></div>
            </div>
        </div>
    </div>

    <!--评价-->
    <a href="" name="pingjia"></a>
    <div id="pj">
        <div id="pj_bt">
            <span class="pj_bt_dp pj_dp">点评</span><span class="pj_dp_sl">(${remarkCount})</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <!--<span class="pj_bt_dp pj_wd">问答</span><span class="pj_wd_sl">(180)</span>-->
        </div>
        <div id="dp">
            <!--<div id="wydp">

            </div>-->
            <%--<div id="dpsx">--%>
                <%--<input type="radio" name="sx" checked/><span class="dpsx_qb">全部</span>--%>
                <%--<input type="radio" name="sx"/><span>好评(2031)</span>--%>
                <%--<input type="radio" name="sx"/><span>中评(317)</span>--%>
                <%--<input type="radio" name="sx"/><span>差评(6)</span>--%>
                <%--<span class="dp_rmpx"><a href="#">热门排序↓</a></span>--%>
                <%--<span class="dp_sjpx"><a href="#">时间排序↓</a></span>--%>
            <%--</div>--%>

            <c:if test="${article!=null}">
                <c:forEach items="${article}" var="var1" varStatus="varSs">
                    <div id="yhdp">
                        <table>
                            <tr>
                                <td rowspan="3" class="yhdp_yhmtp">
                                    <img src="${var1.formUser.via}"/><br/>
                                </td>
                                <td>${var1.content}</td>
                            </tr>
                            <tr>
                                <td>
                                        <%--这个我也不知道什么意思，我有空搞几个星星在这里--%>

                                    <c:forEach begin="1" end="${var1.star}">
                                        <img src="/img/shineStar.png" width="20px"/>
                                    </c:forEach>
                                    <c:forEach begin="${var1.star+1}" end="5">
                                        <img src="/img/greyStar.png" width="20px"/>
                                    </c:forEach>

                                </td>
                            </tr>
                            <tr>
                                <td>
                                    #卫生间干净 #客房干净 #服务很热情 #态度热情 #风格独特。空间体验好 #安全放心 #锁链不错
                                    入住体验非常不错，老人很满意，前台和客房服务都很热情。
                                </td>
                            </tr>
                            <tr>
                                <td rowspan="2" class="yhdp_yhm"><span>${var1.formUser.username}</span></td>
                                <td class="yhdp_img">
                                    <img src="../../../img/001.jpg"/>
                                    <img src="../../../img/002.jpg"/>
                                    <img src="../../../img/003.jpg"/>
                                    <img src="../../../img/004.jpg"/>
                                </td>
                            </tr>
                                <tr class="yhdp_zh">
                                <td>
                                    <span>时间：${var1.createDatetime}</span>
                                    <span class="yhdp_xx" data-id="${varSs.index}" onclick="showCommand(this)">
												查看评论
											</span>

                                    <span class="yhdp_yy">
												<span>
													<img src="../../../img/dianzan.png" class="dianzan"/>
													<img src="../../../img/dianzan2.png" class="dianzan2"/>
												</span>&nbsp;<a href="###" style="text-decoration: none;color: black">赞一个</a>
											</span>
                                    <span class="yhdp_pl" onclick="discuss()">
													<span>
														<img src="../../../img/xinxi.png" class="xinxi"/>
														<img src="../../../img/xinxi2.png" class="xinxi2"/>
													</span>&nbsp;评论
											</span>
                                    <script type="text/javascript">

                                        function discuss() {
                                            var ele = document.getElementsByClassName("modal")[1];
                                            ele.style.visibility = 'visible';
                                            ele.style.opacity = '1';
                                            // show backdrop effect
                                            var backdrop = document.getElementsByClassName("backdrop")[0];
                                            backdrop.style.opacity = '1';
                                            backdrop.style.visibility = 'visible';
                                        }

                                        function showCommand(obj) {

                                            var index = $(obj).attr("data-id");
                                            $($(".child_command")[index]).toggle();
                                        }

                                        function delArticle() {
                                            var form = new FormData();
                                            var articleId = $("#del_reply").data("id");
                                            var formArticleId = $("#del_reply").data("from");
                                            form.append("delId", articleId);
                                            form.append("formId", formArticleId);
                                            $.ajax({
                                                url: '/utils/delArticleById?delId=' + articleId + "&formId=" + formArticleId,
                                                data: '',
                                                // contentType:'application/x-www-form-urlencoded',
                                                success: function (data) {

                                                    if (data == "0") {
                                                        alert("删除异常")
                                                    } else if (data == "1") {
                                                        alert("删除成功")

                                                        $("#" + formArticleId + "_" + articleId).remove();
                                                    } else {
                                                        alert("只能是文章作者或评论作者可删除")
                                                    }
                                                },
                                                error: function (err) {

                                                    console.log(err)
                                                    alert("出错了")
                                                },
                                                complate: function (d) {

                                                }
                                            })
                                        }
                                    </script>
                                    <div class="child_command" id="${var1.articleId}">
                                        <c:if test="${var1.child!=null&&var1.child.size()!=0}">
                                            <c:forEach items="${var1.child}" var="var2">
                                                <ul style="list-style: none; top: 0px;left: 100px;margin: 0px; padding: 0px;">
                                                    <li id="${var2.parentId}_${var2.articleId}"
                                                        style="border: black 1px solid;border-bottom:none">
                                                        <div class="reply">
                                                            <span class="reply_name">${var2.formUser.username}</span>
                                                            回复
                                                            <span class="reply_name">${var2.toUser.username}</span>
                                                            ：
                                                            <span>${var2.content}</span>
                                                            <c:if test="${userInfo!=null}">
                                                                <a style="margin-top: -2px;" data-id="${var2.articleId}"
                                                                   data-from="${var2.parentId}" class="del_reply"
                                                                   id="del_reply" onclick="delArticle()">

                                                                    <img src="/img/del.png" width="25px" title="删除这条评论"
                                                                         alt="删除">
                                                                </a>
                                                            </c:if>

                                                        </div>
                                                    </li>
                                                </ul>
                                            </c:forEach>

                                            <div style="text-align: center;font-size: x-large;color: pink;width: 400px;border: 2px dimgrey solid;background: #E5E5E5;left: 308px;margin-left: 310px;">
                                                收起评论
                                            </div>
                                        </c:if>
                                    </div>
                                </td>

                            </tr>


                        </table>

                    </div>
                </c:forEach>
            </c:if>


            <div id="yhdp">
                <table>
                    <tr>
                        <td rowspan="3" class="yhdp_yhmtp"><img src="../../../img/005.jpg"/></td>
                        <td>老人很满意,前台和客房服务都很热情</td>
                    </tr>
                    <tr>
                        <td>五颗星</td>
                    </tr>
                    <tr>
                        <td>
                            #卫生间干净 #客房干净 #服务很热情 #态度热情 #风格独特。空间体验好 #安全放心 #锁链不错
                            入住体验非常不错，老人很满意，前台和客房服务都很热情。
                        </td>
                    </tr>
                    <tr>
                        <td rowspan="2" class="yhdp_yhm"><span>glzf7357</span></td>
                        <td class="yhdp_img">
                            <img src="../../../img/001.jpg"/>
                            <img src="../../../img/002.jpg"/>
                            <img src="../../../img/003.jpg"/>
                            <img src="../../../img/004.jpg"/>
                        </td>
                    </tr>
                    <tr class="yhdp_zh">
                        <td>
                            <span>时间：2022年8月24日  11:40</span>
                            <span class="yhdp_yy"><span><img src="../../../img/dianzan.png" class="dianzan"/><img
                                    src="../../../img/dianzan2.png" class="dianzan2"/></span>&nbsp;有用</span>
                            <span class="yhdp_pl"><span><img src="../../../img/xinxi.png" class="xinxi"/><img
                                    src="../../../img/xinxi2.png" class="xinxi2"/></span>&nbsp;评论</span>
                        </td>
                    </tr>
                </table>
            </div>


            <%-- 这个打算用作子评论以及容错   做的三层--%>
            <div id="yhdp">
                <table>
                    <tr>
                        <td rowspan="3" class="yhdp_yhmtp"><img src="../../../img/005.jpg"/></td>
                        <td>老人很满意,前台和客房服务都很热情</td>
                    </tr>
                    <tr>
                        <td>五颗星</td>
                    </tr>
                    <tr>
                        <td>
                            #卫生间干净 #客房干净 #服务很热情 #态度热情 #风格独特。空间体验好 #安全放心 #锁链不错
                            入住体验非常不错，老人很满意，前台和客房服务都很热情。
                        </td>
                    </tr>
                    <tr>
                        <td rowspan="2" class="yhdp_yhm"><span>glzf7357</span></td>
                        <td class="yhdp_img">
                            <img src="../../../img/001.jpg"/>
                            <img src="../../../img/002.jpg"/>
                            <img src="../../../img/003.jpg"/>
                            <img src="../../../img/004.jpg"/>
                        </td>
                    </tr>
                    <tr class="yhdp_zh">
                        <td>
                            <span>时间：2022年8月24日  11:40</span>
                            <span class="yhdp_yy"><span><img src="../../../img/dianzan.png" class="dianzan"/><img
                                    src="../../../img/dianzan2.png" class="dianzan2"/></span>&nbsp;有用</span>
                            <span class="yhdp_pl"><span><img src="../../../img/xinxi.png" class="xinxi"/><img
                                    src="../../../img/xinxi2.png" class="xinxi2"/></span>&nbsp;评论</span>
                        </td>
                    </tr>
                </table>
            </div>


            <div id="yhdp_fenye">
                <a href="">首页</a>
                <a href="">上一页</a>
                <a href="">1</a>
                <a href="">2</a>
                <a href="">3</a>
                <a href="">下一页</a>
                <a href="">尾页</a>
                <span>1/3页</span>
                <span>共34条</span>
            </div>
        </div>
    </div>

    <!--页脚-->
    <div id="" style="margin-top: 100px;">
        <img src="../../../img/yejiao.png"/>
    </div>
</div>
</body>
</html>
